
const btnColor = [
  "#FFCCCC",
  "#FFEE99",
  "#CCFF99",
  "#BBFFEE",
  "#CCCCFF",
  "#F0BBFF",
];
const btnArr = document.getElementsByTagName("button");
//改变颜色的
for (let i = 0, len = btnArr.length; i < len; i++) {
  var btn = btnArr[i];
  btn.onclick = async (event) => {
    const index = event.target.className.split("-")[1];
    // 调用Chrome接口取出当前标签页
    const [tab] = await chrome.tabs.query({
      active: true,
      currentWindow: true,
    });

    // 以当前标签页为上下文，执行函数
    chrome.scripting.executeScript({
      target: { tabId: tab.id },
      args: [{ btnColor, index }],
      //  无法访问外面的数据，args 可传递外面的数据
      function: (event) => {
        document.body.style.backgroundColor = event.btnColor[event.index - 1];
      },
    });
  };
}

// 修改弹出框的
document.querySelector("#but1").addEventListener("click", async () => {
  const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });

  chrome.scripting.executeScript({
    target: { tabId: tab.id },
    args: [],
    function: (event) => {
      document.querySelector("#imgHre").style.display = "block";
      let time = setTimeout(() => {
        document.querySelector("#imgHre").style.display = "none";
        clearTimeout(time);
      }, 500);
    },
  });
});

// 更换背景图
document.querySelector("#sssdff").addEventListener("click", async () => {
  let url = chrome.runtime.getURL("../img/icon.png");
  const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });

  chrome.scripting.executeScript({
    target: { tabId: tab.id },
    args: [url],
    function: (event) => {
      document.body.style.backgroundAttachment = "fixed";
      document.body.style.backgroundSize = "100% 100%";
      document.body.style.backgroundImage = `url(${event})`;
    },
  });
});

// 设置徽章文本

document.querySelector("#badgeText").addEventListener("click", async () => {
  chrome.action.setBadgeText({ text: "88" });
});

// 设置徽章文本颜色
document.querySelector("#badgeBg").addEventListener("click", async () => {
  chrome.action.setBadgeBackgroundColor({ color: [153, 96, 230, 2] });
});

// 桌面通知
// id: "11111"
// type: 通知类型，有basic（默认）、image、list、progress
// iconUrl: 图标的url
// imageUrl："image"类型的通知的图片的URL
// appIconMaskUrl: 应用图标URL的掩码，用以规范URL，这个扩展应该是用不到
// title: 通知主标题
// message: 通知副标题
// contextMessage: 通知的备选内容,
// progress:进度
// buttons: [{title: '按钮1的标题', iconUrl:' icon.png'},{title: '按钮2的标题',iconUrl: 'icon.png'}],  最多两个按钮
// items: [{title: '消息1', message: '消息1'},{title: '消息2', message: '消息2'}], 通知列表，对应type是list时使用，只有title和message两个属性
// eventTime: Date.now() + 2000　　通知的时间戳
function notify() {
  chrome.notifications.create(
    "ids",
    {
      type: "basic",
      title: "桌面通知",
      message: "自定义桌面消息通知 ！！！",
      iconUrl: "../img/icon.png",
      contextMessage: "87 秒后，清除桌面通知 ！！！",
      buttons: [{ title: "按钮标题", iconUrl: "../img/icon.png" }],
      eventTime: Date.now() + 87000,
    },
    (id) => console.log("111111111")
  );
}
document.getElementById("notify").onclick = function () {
  notify();
  setTimeout(function (e) {
    // 清除桌面通知成功
    // 这里的id只要和创建的时候设置id值一样就行了，就可以清理对应id的通知了
    chrome.notifications.clear("ids");
  }, 87000);
};

// 消息通信 向背景页通信

document.getElementById("message").onclick = function () {
  chrome.runtime.sendMessage({ msg: "Hello" }, function (event) {
    // chrome.notifications.create("msg", {
    //   type: "basic",
    //   title: "响应通知",
    //   message: `收到响应，响应报文： ${event.farewell}`,
    //   iconUrl: "icons/icon16.png",
    // });
  });
};

// 自定义菜单 向背景页发送消息
document.getElementById("contextMenus").onclick = function () {
  chrome.runtime.sendMessage({ msg: "contextMenus" }, function (event) {
    chrome.notifications.create("menus", {
      type: "basic",
      title: "响应通知",
      message: `收到响应，响应报文`,
      iconUrl: "img/icon.png",
    });
  });
};
//删除自定义菜单

document.getElementById("removeAll").onclick = function () {
    chrome.contextMenus.removeAll(()=>{
      console.log("删除成功");
    })
};
// 更新菜单 
document.getElementById("update").onclick = function () {
    chrome.contextMenus.update("goToBaidu",{
        parentId: "collectImageToSxj",
        title: "改变的百度",
        contexts: ["image"],
    },()=>{
      console.log("删除成功");
    })
};
// 删除一个菜单
document.getElementById("removeOne").onclick = function () {
    chrome.contextMenus.remove("goToBaidu",()=>{
      console.log("删除成功");
    })
};

// 向背景页脚本发送消息
const baidu = document.getElementById("baiduauto")
 baidu.onclick = async function (){
 
    chrome.runtime.sendMessage({greeting: "hello"}, function(response) {  
        console.log(response);  
      });

   
 }

 //捕获窗口 给当前窗口拍照生成一张图片
 document.getElementById("capture").onclick = function () {
    chrome.tabs.captureVisibleTab(
         null,
         {format: "png",quality: 100}, 
         dataUrl => {
         console.log(dataUrl)
        // chrome.tabs.create({ url: dataUrl })
        document.getElementById("capsrc").src = dataUrl
        
        }
        )
}

// 跳转网页
document.getElementById("linkBidu").onclick = function () {
    chrome.tabs.create({ url: "https://www.baidu.com" })
}

//长期连接
